import { useState } from "react"
import { useEffect } from "react"


function InputText({labelTitle,labelStyle, type, containerStyle, defaultValue, placeholder, updateFormValue, updateType,errors}){

    const [value, setValue] = useState(defaultValue)
    const [error, setError] = useState(errors)
    useEffect(() => {
        setValue(defaultValue)
        setError(errors)
    }, [defaultValue,error])

    const updateInputValue = (val) => {
        setValue(val)
        updateFormValue({updateType, value : val})
    }

    return(
        <div className={`form-control w-full ${containerStyle}`}>
            <label className="label">
                <div className='flex flex-row items-start justify-center' ><span className={"label-text text-base-content " + labelStyle}>{labelTitle}</span></div>
            </label>
            <input type={type || "text"}  value={value} placeholder={placeholder || ""}
             onChange={(e) => updateInputValue(e.target.value)} className="input  input-bordered w-full " />
        </div>
    )
}


export default InputText